<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>video</title>
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"/>
<link rel="stylesheet" href="css/mui.min.css"/>
<link rel="stylesheet" href="css/icons-extra.css"/><!--拓展字体1-->
<link rel="stylesheet" href="css/icomoon.css"/><!--拓展字体2-->
<link rel="stylesheet" href="css/style.css"/><!--自定义样式-->
<link rel="stylesheet" href="//g.alicdn.com/de/prismplayer/2.7.2/skins/default/aliplayer-min.css"/>
<script type="text/javascript" src="js/mui.min.js"></script>
<script type="text/javascript" src="//g.alicdn.com/de/prismplayer/2.7.2/aliplayer-min.js"></script>
<script type="text/javascript" src="js/config.js"></script><!--自定义脚本-->
<script type="text/javascript" src="js/common.js"></script><!--自定义脚本-->
</head>
<body>
<header id="header" class="mui-bar mui-bar-nav">
    <a class="mui-icon mui-icon-back mui-pull-left mui-action-back"></a>
    <h1 class="mui-title dry-text-color-2">万花筒</h1>
    <a class="mui-icon mui-icon-more mui-pull-right" href="#popover"></a>
</header>
<div id="popover" class="mui-popover" style="width:100px;">
    <ul class="mui-table-view">
        <li class="mui-table-view-cell"><a href="#">分享</a></li>
        <li class="mui-table-view-cell"><a href="#" id="write-top-comment">发表评论</a></li>
    </ul>
</div>
<div class='dry-top-video'>
    <div class='prism-player' id='player' source='//xxfaxy.oss-cn-hangzhou.aliyuncs.com/mp4/仓科加奈写真.mp4'></div>
</div>
<div class='mui-content dry-video-info'>
    <div class='mui-card' style="margin:0;">
        <div class='mui-card-header'>2017年年度热门歌曲凉凉</div>
        <div class='mui-card-content'>
            <div class="mui-row">
                <div class="mui-col-sm-8 mui-col-xs-8 dry-font-size-2"><p>发布:2018-10-07 15:20:25</p></div>
                <div class="mui-col-sm-4 mui-col-xs-4 dry-font-size-2 dry-text-right"><p>播放:5556</p></div>
            </div>
            <div>据香港媒体报道，舒淇和赵薇合作《中餐厅》第二季，每人单季片酬人民币5000万元，结果要退回人民币4000万元给湖南卫视，节目制作公司代替电视台讨片酬。有知情人士爆料，赵薇配合国家政策乖乖缴回，舒淇起初不愿意，是赵薇打电话相劝才答应，面对爆料，舒淇经纪人管小姐则没有回应。</div>
            <div class="dry-tag-box">
                <button type="button" class="mui-btn mui-btn-outlined dry-font-size-1">默认</button>
                <button type="button" class="mui-btn mui-btn-outlined dry-font-size-1">默认</button>
                <button type="button" class="mui-btn mui-btn-outlined dry-font-size-1">默认</button>
                <button type="button" class="mui-btn mui-btn-outlined dry-font-size-1">默认</button>
                <button type="button" class="mui-btn mui-btn-outlined dry-font-size-1">默认</button>
                <button type="button" class="mui-btn mui-btn-outlined dry-font-size-1">默认</button>
                <button type="button" class="mui-btn mui-btn-outlined dry-font-size-1">默认</button>
                <button type="button" class="mui-btn mui-btn-outlined dry-font-size-1">默认</button>
                <button type="button" class="mui-btn mui-btn-outlined dry-font-size-1">默认</button>
            </div>
            <div class="mui-row  dry-font-size-1" style="margin-top:10px;color:#8f8f94;">
                <div class="mui-col-sm-3 mui-col-xs-3 dry-text-center"><span class='icon-play3'></span><br/>5600</div>
                <div class="mui-col-sm-3 mui-col-xs-3 dry-text-center"><span class='mui-icon-extra mui-icon-extra-like dry-icon-active'></span><br/>80000255</div>
                <div class="mui-col-sm-3 mui-col-xs-3 dry-text-center"><span class='mui-icon mui-icon-chatboxes'></span><br/>4500</div>
                <div class="mui-col-sm-3 mui-col-xs-3 dry-text-center"><span class='mui-icon mui-icon-more'></span><br/>5685</div>
            </div>
        </div>
        <div class='mui-card-footer'>
            <a class='mui-card-link'><img src='images/author.png' width="24" height="24"/>&nbsp;孤独的人</a>
            <a class='mui-card-link'><button type="button" class="mui-btn mui-btn-primary">关注</button></a>
        </div>
    </div>
</div>
<p class="dry-text-center" style="margin-top:15px;">评论(1562)</p>
<div id="pullRefreshContainer" class="mui-content mui-scroll-wrapper" style="background-color:white;">
    <div id="itemBox" class="mui-scroll dry-set-header-margin"></div>
</div>
<script type="text/javascript">
var pullRefreshContainerId = '#pullRefreshContainer';
mui.init({gestureConfig:{tap: true, longtap: true}});

initPullRefresh(pullRefreshContainerId, pullUpRefreshVideoCommentCallback, pullDownRefreshVideoCommentCallback);
setPlayer('player', '//xxfaxy.oss-cn-hangzhou.aliyuncs.com/mp4/仓科加奈写真.mp4');

mui("#itemBox").on("longtap", ".dry-comment-box", function(){
    plus.nativeUI.actionSheet(
    {
        title: "请选择操作",
        cancel: "关闭",
        buttons: [
            {title: "复制评论"},
            {title: "回复评论"}
        ]
    },
    function(e){
        //plus.nativeUI.alert(e.index);
        openWindow('write_comment.html', '发表评论');
    }
    );
    //plus.nativeUI.alert(this.getAttribute("index"));
});

autoOpenUrl('write-top-comment', 'write_comment.html', '发表评论');
</script>
</div>
</body>
</html>
